.search-div {
    display: inline-block;
    position: relative;
    &:hover {
        .search-img {
            background: url('../images/search-hover.png');
            background-size: 100% 100%;
        }
    }
    .search-input {
        padding: 0 54px 0 14px;
        width: 220px;
        height: 28px;
        background-color: #ffffff;
        border-radius: 3px;
        border: solid 1px #d9d9d9;
        line-height: 28px;
        font-family: '微软雅黑';
        &::-webkit-input-placeholder {
            color: #cccccc;
        }
        &::-moz-placeholder {
            /* Mozilla Firefox 19+ */
            color: #cccccc;
        }
        &:-moz-placeholder {
            /* Mozilla Firefox 4 to 18 */
            color: #cccccc;
        }
        &:-ms-input-placeholder {
            /* Internet Explorer 10-11 */
            color: #cccccc;
        }
    }
    .search-img {
        display: inline-block;
        position: absolute;
        width: 16px;
        height: 16px;
        top: 6px;
        right: 18px;
        cursor: pointer;
        background: url('../images/search-origin.png');
        background-size: 100% 100%;
    }
    .search-img:hover {
        background: url('../images/search-hover.png');
        background-size: 100% 100%;
    }
    // input:focus {
    //     border: 1px solid #91BBFE;
    //     outline: none;
    // }
    .search-close {
        display: inline-block;
        position: absolute;
        width: 12px;
        height: 12px;
        top: 8px;
        right: 38px;
        cursor: pointer;
        background-image: url('../images/search-close.png');
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat;
        vertical-align: middle;
    }
}